<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .container {
            color: blue;
        }
    </style>
</head>

<body>
    <div class="container">
        hello

    </div>
    <script>
        var containerEle = document.querySelector(".container");
        // containerEle.appendChild
        // document.onclick = function(){
        //     containerEle.style.color = "red";
        // }
        // // containerEle.innerHTML = "123";  //覆盖填充
        // var divEle = document.createElement("p");
        // divEle.innerHTML = "123";
        // containerEle.appendChild(divEle);  // 追加 ,会在最后追加；
        // var divEle2 = document.createElement("p");
        // divEle2.innerHTML = "456";
        // containerEle.appendChild(divEle2); 
        // var num = 1;
        // setInterval(function () {
        //     document.title = num;
        //     num++;
        // }, 1000);
        // requestAnimationFrame
        

    </script>
</body>

</html>